html, body{
	width: 100%;
	height: 100%;
	color: #333;
	overflow: hidden;
}

input[type=text], input[type=password] {
	margin: 5px;
	padding: 0 10px;
	width: 200px;
	height: 34px;
	color: #404040;
	background: white;
	border: 1px solid;
	border-color: #c4c4c4 #d1d1d1 #d4d4d4;
	border-radius: 2px;
	outline: 5px solid #eff4f7;
	-moz-outline-radius: 3px;
	-webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.12);
	box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.12);
}


.login-container{
	background: #0ca3d2;
	width: 100%;
	height: 100%;
	padding-top: 100px;
}

.login-area{
	position: relative;
	margin: 0 auto;
	padding: 20px 20px 20px;
	width: 310px;
	background: white;
	border-radius: 3px;
	-webkit-box-shadow: 0 0 200px rgba(255, 255, 255, 0.5), 0 1px 2px rgba(0, 0, 0, 0.3);
	box-shadow: 0 0 200px rgba(255, 255, 255, 0.5), 0 1px 2px rgba(0, 0, 0, 0.3);
}

.login-area:before {
	content: '';
	position: absolute;
	top: -8px;
	right: -8px;
	bottom: -8px;
	left: -8px;
	z-index: -1;
	background: rgba(0, 0, 0, 0.08);
	border-radius: 4px;
}

.login-area h1{
	margin: -20px -20px 21px;
	line-height: 40px;
	font-size: 15px;
	font-weight: bold;
	color: #555;
	text-align: center;
	text-shadow: 0 1px white;
	background: #f3f3f3;
	border-bottom: 1px solid #cfcfcf;
	border-radius: 3px 3px 0 0;
	background-image: -webkit-linear-gradient(top, whiteffd, #eef2f5);
	background-image: -moz-linear-gradient(top, whiteffd, #eef2f5);
	background-image: -o-linear-gradient(top, whiteffd, #eef2f5);
	background-image: linear-gradient(to bottom, whiteffd, #eef2f5);
	-webkit-box-shadow: 0 1px whitesmoke;
	box-shadow: 0 1px whitesmoke;
}

.login-area p:first-child {
	margin-top: 0;
}
.login-area p {
	margin: 20px 0 0;
}

.login-area input[type=text], .login-areainput[type=password] {
	width: 278px;
}

.login-area p.remember_me {
	float: left;
	line-height: 31px;
}


.login-area p.remember_me label {
	font-size: 12px;
	color: #777;
	cursor: pointer;
}

.login-area p.remember_me input {
	position: relative;
	bottom: 1px;
	margin-right: 4px;
	vertical-align: middle;
}

.login-area p.submit {
	text-align: right;
}







.main-container{
	background: #eee;
	width: 100%;
	height: 100%;
	display: -webkit-box;
}

.main-container .main-body{
	display: -webkit-box;
	-webkit-box-flex: 1;
	-webkit-box-orient: vertical;
}

.main-header{
	height: 3em;
	padding: 0 0.5em;
	overflow: hidden;
	position: relative;
	border-top: 1px solid #000;


	background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(0%, #ff9704), color-stop(2%, #9d5c00), color-stop(100%, #502f00));
	background-image: linear-gradient(top, #ff9704 0%, #9d5c00 2%, #502f00 100%);

	display: -webkit-box;
	-webkit-box-flex: 0;
}

.main-header h1{
z-index: 0;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
text-align: center;
line-height: 2.4em;
font-weight: bold;
font-size: 1.2em;
text-shadow: #000 0 1px 0;
color: #fff;
}



.main-content{
	display: -webkit-box;
	-webkit-box-flex: 1;
	overflow-y: auto;
}


.detail-container{
	padding: 20px;
	display: -webkit-box;
	-webkit-box-flex: 1;
	-webkit-box-orient: vertical;
}

.detail-container ul{

}

.detail-container{
	
}




.boxCenter {
	-webkit-box-pack: center;
	display: -webkit-box;
	-webkit-box-orient: horizontal;
	-webkit-box-align: stretch;
	-webkit-box-flex: 0;
	height: 50%;
}

.category-thumb {
	background-color: #201c11;
	padding: 5px;
	color: #ccc;
	margin: 10px;
	width: 222px;
	height: 190px;
	overflow: hidden;
	cursor: pointer;
}

.category-thumb .thumbnail {
margin-bottom: 8px;
height: 87px;
}

.category-thumb h1.title {
font-size: 18px;
font-weight: bold;
margin: 0 0 10px 10px;
}
.category-thumb .desc {
font-size: 11px;
font-weight: bold;
margin: 0 0 0 10px;
padding-bottom: 10px;
height: 27px;
overflow: hidden;
}


.popup{
	width: 400px;
	height: 300px;
	display: none;
	z-index: 9999;
	margin: 6px;
	position: absolute !important;
	top: 50%;
	left: 50%;
	margin: -150px -200px;

	-webkit-border-radius: 0.3em;
	-moz-border-radius: 0.3em;
	-ms-border-radius: 0.3em;
	-o-border-radius: 0.3em;
	border-radius: 0.3em;
	-webkit-box-shadow: rgba(0, 0, 0, 0.8) 0 0.2em 0.6em;
	-moz-box-shadow: rgba(0, 0, 0, 0.8) 0 0.2em 0.6em;
	box-shadow: rgba(0, 0, 0, 0.8) 0 0.2em 0.6em;
	border: 6px solid #03111a;
	background-color: #fff;
}


.casa-container{
	overflow-y: auto;
}

section{
	padding-bottom: 100px;
}